ZLMediaKit编译与webrtc推拉流测试
ZLMediaKit支持了webrtc的推流与播放。特此记录下编译与测试的过程。编译环境OS版本:Ubuntu 20.04.2 LTSopenssl版本:OpenSSL 1.1.1fgcc版本:9.3.0cmake版本:3.16.3编译准备工作安装openssl。$ git clone https://github.com/openssl/openssl.git$ ./config$ make -j4$ sudo make install# 查看openssl版本$ openssl version -a安装...
2024-01-10React:快速上手(5)——掌握Redux(2)
本文部分内容参考阮一峰的Redux教程。React-Redux原理React-Redux运行机制 我觉得这张图清楚地描述React-Redux的运行机制: React-Redux将组件划分为两类,第一类是UI组件:只负责 UI 的呈现,不带有任何业务逻辑没有状态(即不使用this.state这个变量)所有数据都由参数(this.props)提供不使用任...
2024-01-10React和Vue区别
1.监听数据变化的实现原理不同Vue通过 getter/setter以及一些函数的劫持,能精确知道数据变化。React默认是通过比较引用的方式(diff)进行的,如果不优化可能导致大量不必要的VDOM的重新渲染。为什么React不精确监听数据变化呢?这是因为Vue和React设计理念上的区别,Vue使用的是可变数据,而React更强...
2024-01-10Vue.directive使用注意(小结)
指令钩子函数会被传入以下参数:el:指令所绑定的元素,可以用来直接操作 DOM 。binding:一个对象,包含以下属性:vnode:Vue 编译生成的虚拟节点。移步 VNode API 来了解更多详情。 ◦name:指令名,不包括 v- 前缀。◦value:指令的绑定值,例如:v-my-directive="1 + 1" 中,绑定值为 2。◦oldValue:指令...
2024-01-10vue+echarts实现进度条式柱状图
本文实例为大家分享了vue+echarts实现进度条式柱状图的具体代码,供大家参考,具体内容如下效果图如下代码:<template> <div class="content-page"> <div class="tab-content"> <div id="myChart1"></div> </div> </div></template><script>import * as echarts from 'echarts';export default { data() { ...
2024-01-10useRef和createRef有什么区别?
我偶然发现钩子文档useRef。看他们的例子…function TextInputWithFocusButton() { const inputEl = useRef(null); const onButtonClick = () => { // `current` points to the mounted text input element inputEl.current.focus(); }; return ( <> <input ref={inputEl} ty...
2024-01-10vue,函数返回reactive对象,返回类型应该如何申明?
网上大部分是关于直接赋值的方法。如:interface Data { name: number}const data: Data = reactive({ name: 1})这段代码运行确实不会报错,data的类型就是Data但是,我想要实现如:const renderData =() => { return reactive({ name: 1 })}这个时候不...
2024-02-17不吹不黑丨用Vue和React构建相同应用程序,区别在哪?
作者 | Sunil Sandhu译者 | 无明在工作中使用了 Vue 之后,我已经对它有了相当深入的了解。同时,我也对 React 感到好奇。我阅读了 React 的文档,也看了一些教程视频,虽然它们很棒,但我真正想知道的是 React 与 Vue 有哪些区别。这里所说的区别,并不是指它们是否都具有虚拟 DOM 或者它们如何渲染页面...
2024-01-10React和Vue特性和书写差异
Vue均使用ES6语法,主要以单文件组件为例,写法上优先使用缩写。React使用TS语法。生命周期VueReact入口&根实例Vueconst app = new Vue({ /* 选项 */ render: (h) => h(App) // App为根组件}).$mount('#app')ReactReactDOM.render( <App/>, // App为根组件 document.getElementById('app'))组件定义Vue// 定义组件构造器va...
2024-01-10Vue实现active点击切换
循环的情况:1、点击时传入index索引(获取当前点击的是哪个)@click="active(index)"2、将索引值传入class(索引等于几就第几个添加active类):class="{active:index==ins}"3、在data里边添加ins:0(表示默认第一个添加active类)data{ ins:0 } 4、最后在methods里边添加方法ctive (num) { this.ins=num ...
2024-01-10在vue中实现echarts随窗体变化
<div id="myChart" :style="{width: '100%', height: '345px'}"></div><script> export default {mounted(){ this.drawLine(); }, methods: { drawLine(){ var myChartContainer = document.getElementById('myChart'); //用于使chart自适应宽度,通过窗体宽计算容器高宽 var r...
2024-01-10vue钩子函数mounted,页面回退时不执行
一、问题描述目前在做一个电商项目,在商品列表list点击item商品的查看详情按钮时,首次进入详情页,页面会进行渲染,钩子会走mounted,但回退之后,再点击其他商品详情,详情页不会进行更新渲染。问题代码如下:商品列表页:商品详情页:二、解决办法将钩子mounted的操作放入钩子activated,...
2024-01-10vue--vuex详解
Vuex 什么是Vuex? 官方说法:Vuex 是一个专为 Vue.js应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。 个人理解:Vuex是用来管理组件之间通信的一个插件 为什么要用Vue...
2024-01-10Vue-router插件使用
Vue是单页面开发,即页面不刷新。 页面不刷新,而又要根据用户选择完成内容的更新该怎么做?Vue中采用锚点来完成。 如访问http://127.0.0.1#/index就是主页,而访问http://127.0.0.1#/home就是家目录。 手动分析url组成与处理视图的切换非常麻烦,所以Vue提供插件Vue-router,它能够根据用户...
2024-01-10解决vue-router在同一个路由下切换,取不到变化的路由参数问题
最近用vue写项目的时候碰到一个问题,在同一个页面下跳转,路由地址不变,路由参数有变化,一开始只是在data里取路由的参数,发现根本取不到变化的路由参数。在网上查找了一番后发现可以这样写:watch: { '$route' (to, from) { //这样就可以获取到变化的参数了,然后执行参数变化后相应的逻辑就行...
2024-01-10vue-router如何更新路由信息
背景在 App.vue 文件中通过 addRoutes 动态添加路由。访问路由 /login,我发现 this.$route 返回的数据中,meta.a 却是 undefined。如果一秒后再次访问 this.$route,meta.a 为 1。这是为何?create() { const routes = [{ path: "login", name: "login", component: () => import(\'./login.vue), meta: { a: ...
2024-01-10vue-cli3路由vue-router用法
安装npm install vue-router导入vue-router// main.js文件内// 导入vue-routerimport Vue from 'vue' // vue-router是以来vue的import VueRouter from 'vue-router' // 导入vue-router,注意import VueRouter 不能写成 import Vue-Router,因为不支持带-的写法。// 必须要通过 Vue.use() 明确地安装路由功能Vue.use(VueRoute...
2024-01-10解决vue-router路由拦截造成死循环问题
笔记:vue-router路由拦截造成死循环,在做路由拦截的时候,一直出现死循环.router的index.js文件路由配置const router = new Router({routes: [{path: '/login',name: 'login',component: Login,meta: {isShow: true}}, {path: '/',component: Layout,redirect: '/home',meta: {title: "首页菜单"}, children: [{...
2024-01-10对 Vue-Router 进行单元测试的方法
由于路由通常会把多个组件牵扯到一起操作,所以一般对其的测试都在 端到端/集成 阶段进行,处于测试金字塔的上层。不过,做一些路由的单元测试还是大有益处的。对于与路由交互的组件,有两种测试方式:使用一个真正的 router 实例mock 掉 $route 和 $router 全局对象因为大多数 Vue 应用用的都...
2024-01-10vue-router怎么动态配置,比如根据用户权限不同显示路由
1、vue-router怎么动态配置,比如根据用户权限不同显示路由如上图,我想根据用户权限不同,动态添加删除菜单下面是路由配置const routes = [ { path: '/', component: Home, name: '系统管理', iconCls: 'el-icon-setting', children: [ { path: '/Page12', component: Page12, name: '组织机构' }, { path: '/...
2024-01-10vue-router路由导航守卫中next控制实现
使用 vue-router 的导航守卫钩子函数,某些钩子函数可以让开发者根据业务逻辑,控制是否进行下一步,或者进入到指定的路由。例如,后台管理页面,会在进入路由前,进行必要登录、权限判断,来决定去往哪个路由,以下是伪代码:// 全局导航守卫router.beforEach((to, from, next) => {if('no login'){next(...
2024-01-10基于vue项目安装插件谷歌镜像失败问题解决
报错信息:谷歌镜部分像被墙掉了npm ERR! code ELIFECYCLEnpm ERR! errno 1npm ERR! chromedriver@2.46.0 install: `node install.js`npm ERR! Exit status 1npm ERR! npm ERR! Failed at the chromedriver@2.46.0 install script.npm ERR! This is probably not a problem with npm. There i...
2024-01-10【Vue】请问chrome调试代码怎么没高亮显示了?
如图,调试代码没有任何高亮,全黑,请问是哪里设置出问题了吗?回答最新的正式版79.0貌似在控制台调试不能高亮了,可以安装开发者版本(现在最新的是80.0),https://www.google.com/intl/z...请到官网上去下载测试版就可以了,或者等待chrome更新新版(新版会修复这个bug)。测试版地址:https://www.google.c...
2024-01-10vue for 绑定事件
<div > <div class="pro"> <div><img src="../img/favicon.png"> <span>{{item.spin_times}}</span></div> <button @click="buySpins(item.spin_times,item.price)" class="btn btn-info"><b>¥</b><span>{{item.price}}</span></button> </div></div>...
2024-01-10已安装SpecFlow.Allure,但在服务器上它不起作用
我有一个SpecFlow Allure在本地工作,但在服务器上的问题没有。我有Windows 2008服务器和我使用Gradle的.tpl文件。当我加入到我的TPL 相同的设置上的app.config `已安装SpecFlow.Allure,但在服务器上它不起作用<plugins> <add name="Allure" type="Runtime"/></plugins><stepAssemblies> <stepAssembly assembly="Allure.SpecFlowPlu...
2024-01-10三星新气象:TouchWiz臃肿插件全部砍掉
三星新气象:TouchWiz臃肿插件全部砍掉 TouchWiz界面是三星手机的标志,众多的扩展应用、插件更是三星一贯非常喜欢的,但太多的功能一般人根本用不上,也导致系统极为臃肿。为此从Galaxy S5开始,三星就将部分应用和功能改为可选下载方式。 此前有消息称,三星正准备大幅度精简TouchWiz,力图...
2024-01-10在vue项目中使用codemirror插件实现代码编辑器功能(代码高亮显示及自动提示)
1、使用npm安装依赖npm install --save codemirror;2、在页面中放入如下代码<template> <div> <textarea ref="mycode" class="codesql" v-model="code" style="height:200px;width:600px;"></textarea> </div></template><script>import 'codemirror/theme/ambiance.css'import 'codemirror...
2024-01-10vue 各组件 使用 Demo
环境搭建假设你已经通读vue官方文档(文档都没读一遍(至少),那不建议动手撸码),在大致了解vue是什么东西,有什么用,核心概念之后我们就可以开始着手学习vue。首先搭建环境。学习vue,我的建议是通过官手脚手架起步。>>>Installation$ npm install -g vue-cli>>Usage$ vue init <template-name> <project-name>...
2024-01-10vue项目chrome调试不显示代码
项目目录有很多文件:我想调试main.js里面的代码,但是打开Chrome的sources里面看到的没有一个是和本地代码一样的文件:我试过在vue.config.js里面做这样的配置:还是没用如何才能在这里显示main.js代码方便我调试?谢谢各位啦我是用的vue-cli是4.5.10版本的回答...
2024-01-10在macOSBigSur上安装MySQL8.xCompressedTARArchive
因个人能力有限,文章难免存在错误,望斧正,感谢。版本:macOS 11.3 Intel版本MySQL 8.0.24 Compressed TAR Archive一、准备所需文件前往 https://dev.mysql.com/downloads/mysql/ 选择macOS系统的Compressed TAR Archive版本下载,目前最新版本是8.0.24。下载后为~/Downloads/mysql-8.0.24-macos11-x86_64.tar.gz。将其解压至/usr/local并重命...
2024-01-10chrome下的Vue单步调试
一直觉得vue的单步调试很费劲,webpack编译后的代码让人难以捉摸,因为平时使用vs code开发环境,网上找了各种关于vs code单步调试vue的文章做了各种尝试都没成功,断点永远都进不去,断点处一直显示 已设置断点但还未绑定。没找到问题所在,有知道大神们的期待告知哦。使用vue-devtools插件的就不说...
2024-01-10